
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"  %>

<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>维修订单</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <!-- <link rel="shortcut icon" href="/favicon.ico"> -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <link rel="stylesheet" href="<%=basePath %>/resources/Public/Vendor/SUI/dist/css/sm.min.css">
    <link rel="stylesheet" href="<%=basePath %>/resources/Public/Vendor/SUI/dist/css/sm-extend.min.css">
    <link rel="stylesheet" type="text/css" href="<%=basePath %>/resources/Public/Vendor/icon/iconfont.css">

    <link rel="stylesheet" href="<%=basePath %>/resources/Public/css/common.css">

</head>
<body>
<div class="page-group">

    <div class="page xgj-order" id='xgj-order'>

        <div class="content ">
            <div class="buttons-tab">
                <a href="#tab1" class="tab-link active button">待付款</a>
                <a href="#tab2" class="tab-link button">已付款</a>
            </div>

            <div class="tabs">
                <div id="tab1" class="tab active">
                    <div class="list-block media-list" style="">
                        <!-- 订单内容，循环这里 -->
                        <c:if test="${not empty unPay}">
                            <c:forEach items="${unPay}" var="un">
                                <div class="card">
                                    <a class="external" href="<%=basePath %>wx/order/qOrderDetail.do?tranId=${un.orderId}">
                                        <div class="card-content">
                                            <div class="list-block media-list">
                                                <ul>
                                                    <li class="item-content">
                                                            <%--<div class="item-media">
                                                                <img src="<%=basePath %>/resources/Public/images/demo/fffffffff.jpg" width="44">
                                                            </div>--%>
                                                        <div class="item-inner">
                                                            <div class="item-title-row" style="border-bottom: 1px solid #dbdbdb;padding-bottom:.1rem;">
                                                                <div class="item-title" style="border-left: .1rem solid red;padding-left: .3rem;padding-top:.1rem;">${un.bName}</div>
                                                                <div class="pull-right">
                                                                    <span class="" style="color: #E77D00">待付款</span>
                                                                </div>
                                                            </div>
                                                            <div class="item-subtitle item-order-no">订单编号: ${un.orderNo}</div>
                                                            <div class="item-subtitle item-order-time">服务时间: ${un.ReserviceTime}</div>
                                                            <div class="item-subtitle item-order-money" >订单金额:
                                                                <span style="color: #E77D00">
                                                                ￥${un.payPrice}
                                                            </span></div>
                                                            <input type="hidden" id="bName${un.orderId}" value="${un.bName}">
                                                            <input type="hidden" id="money${un.orderId}" value="${un.payPrice}">
                                                            <input type="hidden" id="orderNo${un.orderId}" value="${un.orderNo}">
                                                        </div>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>
                                    </a>
                                    <div class="card-footer">
                                        <span></span>
                                        <span data-id="${un.orderNo}">
                                            <!-- 取消订单有两种状态，btn-cancel-disable  btn-cancel-enable -->
                                            <a href="javascript:cancel(${un.orderId})" class="button  btn-cancel-enable">取消订单</a>
                                            <a href="javascript:pay(${un.orderId})" class="button  button-fill order-pay-btn" >去支付</a>

                                        </span>
                                    </div>
                                </div>
                            </c:forEach>
                        </c:if>
                    </div>
                    <!-- 无订单样式 判断 打开这里即可 -->
                    <c:if test="${empty unPay}">
                        <div class="content-block no-order" >
                            <span class="icon iconfont icon-dingdan1"></span>
                            <span class="tab-label">暂时没有订单</span>
                        </div>
                    </c:if>
                    <!-- end 无订单样式 判断 打开这里即可 -->
                </div>
                <div id="tab2" class="tab">
                    <div class="list-block media-list" >
                        <!-- 订单内容，循环这里 -->
                        <c:if test="${not empty payed}">
                            <c:forEach items="${payed}" var="pay">
                                <a class="external" href="<%=basePath %>wx/order/qOrderDetail.do?tranId=${pay.orderId}">
                                    <div class="card">
                                        <div class="card-content">
                                            <div class="list-block media-list">
                                                <ul>
                                                    <li class="item-content">
                                                        <div class="item-inner">
                                                            <div class="item-title-row" style="border-bottom: 1px solid #dbdbdb;padding-bottom:.1rem;">
                                                                <div class="item-title" style="border-left: .1rem solid red;padding-left: .3rem;padding-top:.1rem;">${pay.bName}</div>
                                                                <div class="pull-right">
                                                                    <span class="" style="color: #E77D00">${pay.state}</span>
                                                                </div>
                                                            </div>
                                                            <div class="item-subtitle item-order-no">订单编号: ${pay.orderNo}</div>
                                                            <div class="item-subtitle item-order-time">上门时间: ${pay.ReserviceTime}</div>
                                                            <div class="item-subtitle item-order-money">订单金额:
                                                                <span style="color: #E77D00">￥${pay.payPrice}</span>
                                                            </div>
                                                        </div>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                </a>
                                <c:if test="${pay.stateValue == 3 || pay.stateValue == 4}">
                                    <div class="card-footer">
                                        <span></span>
                                        <span data-id="${pay.orderNo}">
                                            <a href="javascript:confirmOrder(${pay.orderId})" class="button  button-fill order-service-confirm" >确认服务完成</a>
                                            <input type="hidden" id="en-orderNo${pay.orderId}" value="${pay.orderNo}"/>
                                        </span>
                                    </div>
                                </c:if>
                            </c:forEach>
                        </c:if>
                        <!-- / 订单内容，循环这里end -->

                    </div>
                    <!-- 无订单样式 打开这里即可 -->
                    <c:if test="${empty payed}">
                        <div class="content-block no-order" style="" >
                            <span class="icon iconfont icon-dingdan1 "></span>
                            <span class="tab-label">暂时没有订单</span>
                        </div>
                    </c:if>
                    <!-- end 无订单样式 打开这里即可 -->

                </div>
            </div>

        </div>

        <!--   此处引入 tabar.html -->
        <%@ include file="/page/footer.jsp" %>
        <!-- / 此处引入 tabar.html -->

    </div>
</div>


<script src='<%=basePath %>/resources/Public/Vendor/SUI/dist/js/zepto.js'></script>
<script type="text/javascript">
    $.config = {
        // 路由功能开关过滤器，返回 false 表示当前点击链接不使用路由
        routerFilter: function($link) {
            // 某个区域的 a 链接不想使用路由功能
            if ($link.is('.disable-router a')) {
                return false;
            }
            return true;
        }
    };
</script>
<script src='<%=basePath %>/resources/Public/Vendor/SUI/dist/js/sm.js'></script>
<script src="<%=basePath %>/resources/Public/Vendor/SUI/dist/js/sm-city-picker.min.js" ></script>
<script src='<%=basePath %>/resources/Public/Vendor/SUI/dist/js/sm-extend.min.js'></script>
<script src='<%=basePath %>/resources/Public/js/common.js'></script>



<script type="text/javascript">
    $.init();
    //var $ = require("jquery")(window);
    function cancel(id) {
        //alert($("#phone").val());
        var orderNo = $("#orderNo"+id).val();
        var sendVal = {
            orderNo:orderNo,
        }
        $.confirm("确认取消该订单？", "温馨提示",
            function () {
                $.post("<%=path%>/wx/order/cancelOrderForUnpay.do",sendVal,function(data){
                    //data = eval("(" + data + ")");
                    //$.alert(data);
                    //删除成功，弹出后端的成功提示，刷新页面(或者删除页面中当前订单)
                    if (data.code == 200) {

                        $.toast("订单取消成功");//提示信息

                        //$.router.load("<=path%>"+data.data); //返回一个url,load回去，刷新页面
                        //$.router.load();
                        window.location.reload()
                    }else{
                        //删除失败，失败信息

                        $.toast("订单取消失败");
                    }
                })
                /*$.ajax({
                 type: "post",
                 url: "<=path%>/wx/order/cancelOrderForUnpay.do",
                 data: "orderNo=" + orderNo,
                 success : function(){
                 },
                 error: function(){
                 }
                 });*/
            }
        );
    }

    function confirmOrder(id) {
        //alert($("#phone").val());
        var orderNo = $("#en-orderNo"+id).val();
        //alert("确认取消该订单？");
        $.confirm("确认服务完成？", "温馨提示",
            function () {
                $.ajax({
                    type: "post",
                    url: "<%=path%>/wx/order/confirmOrder.do",
                    data: "orderNo=" + orderNo,
                    success : function(){
                    },
                    error: function(){
                    }
                });
            }
        )
    }

    function pay(id){
        var bName= $("#bName"+id).val();
        var money= $("#money"+id).val();
        var orderNo = $("#orderNo"+id).val();
        $.ajax({
            type: "POST",
            url: "<%=path%>/wx/business/depositweixin.do",
            data: {
                "money": money,
                "trade_no":orderNo
            },
            dataType: "json",
            success: function (data) {
                if (data.result == "0000") {
                    WeixinJSBridge.invoke(
                        'getBrandWCPayRequest', {
                            "appId": data.appId,     //公众号名称，由商户传入
                            "timeStamp": data.timeStamp,         //时间戳，自1970年以来的秒数
                            "nonceStr": data.nonceStr, //随机串
                            "package": data.packageValue,
                            "signType": "MD5",         //微信签名方式:
                            "paySign": data.paySign    //微信签名
                        },
                        function (res) {
                            if (res.err_msg == "get_brand_wcpay_request:ok") {
                                location.href = "<%=path%>/wx/order/qOrders.do"
                            }
                            isSignature = false;
                        }
                    );

                } else {
                    $.toast("参数配置有误");
                    isSignature = false;
                }
            }
        });
    }
</script>



</body>
</html>
